iT邦幫忙

第 11 屆 iThome 鐵人賽

DAY 26
0
Mobile Development

IOS App開發學習日誌系列 第 26

Day26 SwiftUI Layout

  • 分享至 

  • xImage
  •  

今天要介紹SwiftUI當中Layout View的部份的VStack、HStack與Spacer

VStack

A view that arranges its children in a vertical line.
宣告一個區域,讓其中的子物件依照垂直排列
https://ithelp.ithome.com.tw/upload/images/20191012/20120980tg2uYy6zkz.png
參數:

  • spacing:VStack裡各物件的間距
  • alignment:VStack裡各物件靠哪邊排列(預設是.center)
    https://ithelp.ithome.com.tw/upload/images/20191012/20120980T4a1C54ULD.png

HStack

A view that arranges its children in a horizontal line.
和VStack一樣是宣告區域,只是改為讓子物件水平排列
https://ithelp.ithome.com.tw/upload/images/20191012/20120980oltzq7GF4l.png
參數:

  • spacing:HStack裡各物件的間距
  • alignment:HStack裡各物件靠哪邊排列(預設是.center)
    https://ithelp.ithome.com.tw/upload/images/20191012/20120980sT0sHXfsTv.png

Spacer

A flexible space that expands along the major axis of its containing stack layout, or on both axes if not contained in a stack.
可以用spacer將元件隔開做出想要的排列方式
https://ithelp.ithome.com.tw/upload/images/20191012/20120980GyhQV4XeSS.png
https://ithelp.ithome.com.tw/upload/images/20191012/20120980JMBmV3e1XZ.png
https://ithelp.ithome.com.tw/upload/images/20191012/20120980semdIPVuSn.png


上一篇
Day25 SwiftUI初見
下一篇
D27 SwiftUI Viewslibrary
系列文
IOS App開發學習日誌30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言